<template>
  <div class="tiktok-write-off-record-detail">
    <c-title text="核销记录"></c-title>
    <div class="head">
      <img v-if="details.status==2" class="write-off"
        src="https://mini-app-img-1251768088.cos.ap-guangzhou.myqcloud.com/plugin/dy-verification-certificate/revoked.png"
        alt="" />
      <img v-else class="write-off" src="https://mini-app-img-1251768088.cos.ap-guangzhou.myqcloud.com/plugin/dy-verification-certificate/write-off.png" alt=""/>
      <div class="center">
        <span>券码<span style="margin-left: 1.5625rem;">：</span></span>
        <span>{{details.code}}</span>
        <span class="copy"  v-clipboard:copy="details.code" v-clipboard:success="onCopy" v-clipboard:error="onError">复制劵码</span>
      </div>
      <div class="center">
        <span>核销时间：</span>
        <span>{{details.created_at}}</span>
      </div>
      <div class="center">
        <span>商品名称：</span>
        <span>{{details.has_one_good&&details.has_one_good.name}}</span>
      </div>
      <div class="center">
        <span>团购类型：</span>
        <span>{{ details.type_name }} <template v-if="details.type==3">共{{ details.all }}次 剩余{{ details.left }}次</template></span>
      </div>
      <div class="center">
        <span>抖音订单：</span>
        <span>{{details.order_id}}</span>
      </div>
      <div class="center">
        <span>抖音商户：</span>
        <span>{{details.has_one_account&&details.has_one_account.name}}</span>
      </div>
    </div>
    <equity  v-if="details.right" :datas="details.right" ref="equityRoot"></equity>
  </div>
</template>

<script>
import equity from './component/equity.vue';
import {Toast} from "vant";
export default {
  components:{equity},
  data() {
    return {
      details:{},
      order_sn:"",
    };
  },
  activated() {
    $http.get("plugin.tiktok-verify-ticket.api.record.detail",{id:this.$route.query.id},"").then(({result,msg,data})=>{
      if(result!==1){
        return this.$toast(msg);
      }
      this.details = data;
      this.order_sn = data.right?.good[0].order_sn;
      this.$nextTick(()=>{
        this.$refs['equityRoot']&&this.$refs['equityRoot'].getOrder(this.$route.query.id);
      })
    })

  },
  methods: {
    onCopy: function (e) {
      Toast({
        message: "复制成功",
        duration: 1000
      });
    },
    onError: function (e) {
      Toast({
        message: "复制失败",
        duration: 1000
      });
    },
  }
};
</script>

<style scoped lang="scss">
.tiktok-write-off-record-detail {
  .write-off{
    width: 4.8125rem;
    height: 4.2188rem;
    position: absolute;
    right: 0.75rem;
    top: 1.0625rem;
  }
  .head {
    position: relative;
    background: #fff;
    border-radius: 0.625rem;
    padding: 1.0625rem 0.75rem 1.25rem;
    margin: 0.625rem 0.75rem;
    font-size: 0.8125rem;
    font-weight: bold;
  }
  .copy{
    margin-left: 0.2813rem;
    border-radius: 0.3125rem;
    border: 1px solid #AAAAB3;
    font-size: 0.6875rem;
    height: 1.125rem;
    width: 3.4375rem;
    text-align: center;
  }
  .center {
    display: flex;
    align-items: center;
    margin-bottom: 0.875rem;
    height: 0.8125rem;
  }
}
</style>
